<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@page import="com.dao.ItemsDAO"%>
<%@page import="com.po.*"%>
<!doctype html>
<html lang="en">
<head>
	<!-- Required meta tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

	<!-- Place favicon.ico in the root directory -->
	<link rel="shortcut icon" type="image/x-icon" href="assets/img/logo/favicon.png">

	<!-- All CSS -->
	<link rel="stylesheet" href="assets/css/animate.css">
	<link rel="stylesheet" href="assets/css/fontawesome.min.css">
	<!-- <link rel="stylesheet" href="https://www.jq22.com/jquery/bootstrap-4.2.1.css"> -->
	<link rel="stylesheet" href="assets/css/metisMenu.css">
	<link rel="stylesheet" href="assets/css/swiper.min.css">
	<link rel="stylesheet" href="assets/css/magnific-popup.css">
	<link rel="stylesheet" href="assets/css/odometer.css">
	<link rel="stylesheet" href="assets/css/spacing.css">
	<link rel="stylesheet" href="assets/css/main.css">
	<link rel="stylesheet" href="assets/css/bootstrap.min.css">

	<title>桂工咸鸭转转网</title>
</head>

<%
	ItemsDAO itemsDAO = new ItemsDAO();
	ArrayList<Items> arrayList = (ArrayList) itemsDAO.getAllItems();
%>

<body class="home-page-3">
<!-- preloader -->
<div id="preloader">
	<div class="preloader">
		<span></span>
		<span></span>
	</div>
</div>
<!-- preloader end  -->

<!-- header-area start -->
<header class="header-area header-style-3">
	<div class="header-top">
		<div class="container-fluid">
			<div class="row align-items-center">
				<div class="col-xl-3 col-lg-3 col-md-4 col-6">
					<div class="logo">
						<a href="index.jsp">
							<img src="assets/img/logo.png" alt="logo">
						</a>
					</div>
				</div>
				<div class="col-xl-6 d-none d-xl-block">
					<nav class="main-menu">
						<ul>
							<li class="">
								<a href="index.jsp">首页</a>
							</li>
							<li class="has-dropdown">
								<a href="#">商品目录</a>
								<ul class="sub-menu">
									<li><a href="#">学习用品</a></li>
									<li><a href="#">电子产品</a></li>
									<li><a href="#">其他产品</a></li>
								</ul>
							</li>
							<li class="has-dropdown">
								<a href="#">卖家中心</a>
								<ul class="sub-menu">
									<li><a href="#">注册开店</a></li>
									<li><a href="product-release.jsp">发布产品</a></li>
								</ul>
							</li>
							<li><a href="#">联系客服</a></li>
							<li><a href="login.jsp">用户中心</a></li>
						</ul>
					</nav>
				</div>
				<div class="col-xl-3 col-lg-9 col-md-8 col-6 d-flex justify-content-end align-items-center">
					<div class="header-search">
						<a href="javascript:void(0);"><i class="far fa-search"></i></a>
					</div>
					<div class="attr-menu-2">
						<ul>
							<li>
								<a href="login.jsp">
									<!-- <i class="far fa-heart"></i> -->
									<i class="fa fa-user-circle"></i>
								</a>
							</li>
							<li>
								<a href="shopcart.jsp">
									<i class="far fa-shopping-cart"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</header>
<main>
	<!-- slider-area start -->
	<div class="slider-area slider-spacing">
		<div class="home-slider-3">
			<div class="swiper-container">
				<!-- Additional required wrapper -->
				<div class="swiper-wrapper">
					<div class="swiper-slide single-slide">
						<div class="container">
							<div class="row">
								<div class="col-xl-5 col-lg-6 col-md-8">
									<div class="slider-content-3">
										<h2 data-animation="fadeInUp" data-delay="0.3s">
											电音吉他
										</h2>
										<p data-animation="fadeInUp" data-delay="0.6s">
											二手吉他，忍痛出售，卢森面单板木吉他民谣吉他41寸初学者新手入门吉它男女生专用乐器
										</p>
										<a href="#" class="read-more" data-animation="fadeInUp" data-delay="0.9s">
											马上购买！
											<i class="far fa-long-arrow-right"></i>
										</a>
									</div>
								</div>
							</div>
						</div>
						<div class="slider-thumb" data-animation="zoomIn" data-delay="0.3s">
							<img src="assets/img/banner/gita.png" alt="slider">
						</div>
					</div>
					<div class="swiper-slide single-slide">
						<div class="container">
							<div class="row">
								<div class="col-xl-5 col-lg-6 col-md-8">
									<div class="slider-content-3">
										<h2 data-animation="fadeInUp" data-delay="0.3s">
											懒人沙发
										</h2>
										<p data-animation="fadeInUp" data-delay="0.6s">
											北欧沙发椅单人沙发设计师休闲椅简约阳台客厅椅子轻奢纺纱扶手椅
										</p>
										<a href="#" class="read-more" data-animation="fadeInUp" data-delay="0.9s">
											马上购买！
											<i class="far fa-long-arrow-right"></i>
										</a>
									</div>
								</div>
							</div>
						</div>
						<div class="slider-thumb" data-animation="zoomIn" data-delay="0.3s">
							<img src="assets/img/banner/slider-thumb.png" alt="slider">
						</div>
					</div>
					<div class="swiper-slide single-slide">
						<div class="container">
							<div class="row">
								<div class="col-xl-5 col-lg-6 col-md-8">
									<div class="slider-content-3">
										<h2 data-animation="fadeInUp" data-delay="0.3s">
											桂林特色茶杯
										</h2>
										<p data-animation="fadeInUp" data-delay="0.6s">
											充满桂林特色，复古风格搭配翡翠色，复古高贵，忍痛出售！
										</p>
										<a href="#" class="read-more" data-animation="fadeInUp" data-delay="0.9s">
											马上购买！
											<i class="far fa-long-arrow-right"></i>
										</a>
									</div>
								</div>
							</div>
						</div>
						<div class="slider-thumb" data-animation="zoomIn" data-delay="0.3s">
							<img src="assets/img/banner/cup.png" alt="slider">
						</div>
					</div>
				</div>
			</div>
			<!-- If we need pagination -->
			<div class="swiper-pagination"></div>
		</div>
	</div>
	<!-- slider-area end -->

	<!-- support-area start -->
	<div class="support-area support-spacing">
		<div class="container-fluid">
			<div class="row support-bg-3">
				<div class="col-xl-4 col-lg-4">
					<div class="support-wrap support-style-2 support-border">
						<div class="icon">
							<img src="assets/img/icon/icon-7.png" alt="icon">
						</div>
						<div class="content">
							<h4>24小时在线</h4>
							<p>
								24/7工作制，随时随地为您竭诚服务
							</p>
						</div>
					</div>
				</div>
				<div class="col-xl-4 col-lg-4">
					<div class="support-wrap support-style-2 support-border">
						<div class="icon">
							<img src="assets/img/icon/icon-8.png" alt="icon">
						</div>
						<div class="content">
							<h4>运输</h4>
							<p>
								支持免费邮寄，支持面对面交易
							</p>
						</div>
					</div>
				</div>
				<div class="col-xl-4 col-lg-4">
					<div class="support-wrap support-style-2">
						<div class="icon">
							<img src="assets/img/icon/icon-9.png" alt="icon">
						</div>
						<div class="content">
							<h4>支付安全</h4>
							<p>
								支付系统安全保证，请放心购买
							</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- support-area end -->

	<!-- product-area start -->
	<div class="product-area product-filter-wrapper pt-90 pb-90">
		<div class="container">
			<div class="row justify-content-center">
				<div class="col-xl-8 text-center">
					<div class="section-title-3 mb-10">
						<h3 class="title">本周最新二手商品</h3>
					</div>
				</div>
			</div>
			<div class="row mb-50">
				<div class="col-xl-12 text-center">
					<!-- filter-nav start -->
					<div class="product-filter-nav filter-nav-2">
						<button class="active" data-filter="*">全部</button>
						<button data-filter=".furnitures">学习用品</button>
						<button data-filter=".chairs">电子产品</button>
						<button data-filter=".lighting">其他产品</button>
					</div>
					<!-- filter-nav end -->
				</div>
			</div>
					<div class="row product-filter-grid">
					<%
						if (arrayList == null || 0 == arrayList.size()) {
					%>

					<%
						} else {

							for (int i = arrayList.size()-1; i > 0 ; i--) {
								Items item = (Items) arrayList.get(i);//获取已经保存了的商品全部信息
					%>

					<div class="col-xl-3 col-lg-3 col-md-6 grid-item chairs lighting">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets\img\470\<%=item.getPicture()%>" alt="">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail.jsp?id=<%=item.getId()%>"><%=item.getName()%></a></h4>
							<span class="price">￥<%=item.getPrice()%></span>
						</div>
					</div>
					</div>		
					<%
						}
						}
					%>
			
			
			<!-- 二手商品 -->
				
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item furnitures">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/book/hz.jpg" alt="活着">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail hz.jsp">《活着》</a></h4>
							<span class="price">¥15.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item chairs lighting">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/electricity/计算器.jpg" alt="计算器">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail jsq.jsp">计算器</a></h4>
							<span class="price">¥9.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item lighting">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/life/便携小风扇.jpg" alt="小风扇">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail fs.jsp">便捷小风扇</a></h4>
							<span class="price">¥5.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item decor furnitures">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/book/shz.jpg" alt="水浒传">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="#">《水浒传》</a></h4>
							<span class="price">¥13.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item chairs decor">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/electricity/听力耳机.jpg" alt="听力耳机">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail tlej.jsp">听力耳机</a></h4>
							<span class="price">¥6.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item lighting">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/life/衣架.jpg" alt="衣架">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-detail yj.jsp">衣架</a></h4>
							<span class="price">¥3.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item decor">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/life/床上桌.jpg" alt="床上书桌">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-single.jsp">床上书桌</a></h4>
							<span class="price">¥10.00</span>
						</div>
					</div>
				</div>
				<div class="col-xl-3 col-lg-3 col-md-6 grid-item furnitures lighting">
					<div class="product-wrap-3 mb-30">
						<div class="product-thumb">
							<img src="assets/img/book/sgyy.jpg" alt="《三国演义》">
							<div class="product-action">
								<a href="#"><i class="far fa-search"></i></a>
								<a href="#"><i class="far fa-shopping-cart"></i></a>
								<a href="#"><i class="far fa-heart"></i></a>
							</div>
						</div>
						<div class="product-content">
							<h4><a href="product-single.jsp">《三国演义》</a></h4>
							<span class="price">¥12.00</span>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- product-area end -->

	<!-- featured-area start -->
	<div class="featured-area featured-spacing">
		<div class="container-fluid">
			<div class="row align-items-center">
				<div class="col-xl-6">
					<div class="featured-product-wrap mt-60 mb-30">
						<div class="thumb">
							<img src="assets/img/thumb/thumb-4.png" alt="thumb">
						</div>
						<div class="content">
							<h4>LED护眼台灯</h4>
							<p>各种型号 七成八成九成新 忍痛出售</p>
							<a href="#" class="read-more">
								查看更多
								<i class="far fa-long-arrow-right"></i>
							</a>
						</div>
					</div>
				</div>
				<div class="col-xl-6">
					<div class="featured-product-wrap mt-60 mb-30">
						<div class="thumb">
							<img src="assets/img/thumb/thumb-5.png" alt="thumb">
						</div>
						<div class="content">
							<h4>精美可爱台灯</h4>
							<p>款式多样 给你的大学生活增添一抹色彩</p>
							<a href="#" class="read-more">
								查看更多
								<i class="far fa-long-arrow-right"></i>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- featured-area end -->

	<!-- blog-area start -->

	<!-- brand-area start -->
	<!-- brand-area end -->
</main>
<!-- main end -->

<!-- footer-area end -->
<footer class="footer-area footer-style-3">
	<div class="footer-bottom">
		<div class="container">
			<div class="row footer-border pt-20 pb-20">
				<div class="col-xl-6 col-lg-6 mb-md-10 mb-xs-10">
					<div class="copyright">
						©2020桂工咸鸭转转团队 reserved.
					</div>
				</div>
				<div class="col-xl-6 col-lg-6">
					<div class="footer-menu">
						<ul>
							<li><a href="index.html">首页</a></li>
							<li><a href="about.html">关于</a></li>
							<li><a href="faq.html">疑问</a></li>
							<li><a href="contact.html">联系我们</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</footer>
<!-- footer-area end -->

<div id="scrollUp"><i class="far fa-angle-double-up"></i></div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/popper.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/swiper.min.js"></script>
<script src="assets/js/metisMenu.min.js"></script>
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
<script src="assets/js/isotope.pkgd.min.js"></script>
<script src="assets/js/jquery.appear.js"></script>
<script src="assets/js/odometer.min.js"></script>
<script src="assets/js/script.js"></script>
</body>
</html>